const { defineConfig } = require("@vue/cli-service");
const path = require("path");
const CompressionWebpackPlugin = require("compression-webpack-plugin");
// 代码压缩
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
const productionGzipExtensions = ["js", "css"];
const apiUrls = "http://192.168.0.55:9900";
const port = 8088; // dev port
function resolve(dir) {
  return path.join(__dirname, dir);
}
module.exports = defineConfig({
  transpileDependencies: true,
  publicPath: "/", // 公共路径
  assetsDir: "./static",
  outputDir: "dist", // 不同的环境打不同包名
  css: {
    // 一次配置，全局使用，这个scss 因为每个文件都要引入
    // 将组件内的 CSS 提取到一个单独的 CSS 文件 (只用在生产环境中)
    // 也可以是一个传递给 `extract-text-webpack-plugin` 的选项对象
    extract: {
      ignoreOrder: true,
    },
    // 是否开启 CSS source map？
    sourceMap: false,
    // 为所有的 CSS 及其预处理文件开启 CSS Modules。
    //modules: false,
    loaderOptions: {
      less: {
        lessOptions: {
          modifyVars: {
            'primary-color': '#3c44ce',
            'link-color': '#3c44ce',
            'border-radius-base': '3px',
          },
          javascriptEnabled: true,
        },
      },
    },
  },
  pages: {
    //多页面入口配置项
    index: {
      // 页面的入口文件
      entry: "src/main.ts",
      // 页面的模板文件
      template: "public/index.html",
      title: "微信公众号文本编辑器",
      // build 生成的文件名称  例： dist/index.html
      filename: "index.html",
      chunks: ["chunk-vendors", "chunk-common", "index"],
    },
  },
  /* 是否在构建生产包时生成 sourceMap 文件，false将提高构建速度 */
  lintOnSave: false,
  productionSourceMap: false,
  devServer: {
    // 配置服务器
    port: port,
    open: false,
    https: false,
    proxy: {      
      "/api-file": {
        target: apiUrls,
        changeOrigin: true,
        pathRewrite: {
          "^/api-file": "/api-file",
        },
      },      
      "/ueditor-api": {
        target: 'http://192.168.0.53:8013',
        changeOrigin: true,
        pathRewrite: {
          "^/ueditor-api": "/static/admin/lib/ueditor/1.4.3/php/controller.php?action=uploadimage",
        },
      },
	 "/ffmpeg": {
        target: 'http://192.168.0.55:9900',
        changeOrigin: true,
        pathRewrite: {
          "^/ffmpeg": "/ffmpeg.php",
        },
      },
    },
  },
  configureWebpack: {
    output: {
      // 输出重构  打包编译后的 文件名称  【模块名称.版本号.js】
      filename: `static/js/[name].[hash].js`,
      chunkFilename: `static/js/[name].[hash].js`,
    },
    resolve: {
      alias: {
        "@": path.resolve(__dirname, "src"),
        "@http": path.resolve(__dirname, "./src/http"),
        "@js": path.resolve(__dirname, "./src/assets/js"),
        "@css": path.resolve(__dirname, "./src/assets/css"),
        "@assets": path.resolve(__dirname, "./src/assets"),
        "@store": path.resolve(__dirname, "./src/store"),
        "@components": path.resolve(__dirname, "./src/components"),
      },
    },
    optimization: {
      minimizer: [
        new UglifyJsPlugin({
          uglifyOptions: {
            warnings: false,
            output: {
              // 删除注释
              comments: true,
            },
            //生产环境自动删除console
            compress: {
              drop_console: true,
              drop_debugger: false,
              pure_funcs: ["console.log", "console.debug"], //移除console
            },
          },
          sourceMap: false,
          parallel: true,
        }),
      ],
    },
    plugins: [
      new CompressionWebpackPlugin({
        algorithm: "gzip",
        test: new RegExp("\\.(" + productionGzipExtensions.join("|") + ")$"),
        threshold: 10240,
        minRatio: 0.8,
        deleteOriginalAssets: false, //是否删除源文件
      }),
    ],
  },
  chainWebpack(config) {
    config.module.rule("svg").exclude.add(resolve("src/assets/icons")).end();
    config.module
      .rule("icons")
      .test(/\.svg$/)
      .include.add(resolve("src/assets/icons"))
      .end()
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({
        symbolId: "icon-[name]",
      })
      .end();
  },
});
